<!DOCTYPE html>
<html>
    <head>
        <title>Speech Recognition plugin demo</title>
		<link rel="stylesheet" href="css/themes/default/jquery.mobile-1.3.2.css" />
		<link rel="stylesheet" href="css/themes/default/jquery.mobile.simpledialog.min.css" />
		<link rel="stylesheet" href="css/themes/default/block.css" />
        <script src="js/jquery-1.10.2.min.js"></script>
        <script type="text/javascript" src="js/jquery.mobile-1.3.2.js"></script>
        <script src="js/jquery.mobile.simpledialog2.min.js"></script>
        <script type="text/javascript" src="cordova.js"></script> 
        <script type="text/javascript" src="SpeechRecognizer.js"></script>
        <script src=http://maps.googleapis.com/maps/api/js?sensor=true></script>  
    </head>
    <body>

        <script type="text/javascript"> 


            function onDeviceReady(){
                console.log("Device is ready");
                var misVariablesGet = getVarsUrl();
                var varbool = false;
                if (misVariablesGet.connect == 'none') {
                	$('<div>').simpledialog2({
					    mode: 'button',
					    headerText: 'Cerrar',
					    headerClose: false,
					    buttonPrompt: 'El dispositivo no se encuentra conectado',
					    buttons : {
							
							'Aceptar': {
								click: function () { 
								  navigator.app.exitApp();
								},
								icon: 'delete',
								theme: 'c'
							  }
					    }
					});
					varbool = true;
                }
                if (varbool) {
                	
                	//setTimeout(function(){navigator.app.exitApp()},5000);
                }
               

				
                //alert(misVariablesGet.connect);
            }
            
            function getVarsUrl(){
			    var url= location.search.replace("?", "");
			    var arrUrl = url.split("&");
			    var urlObj={};   
			    for(var i=0; i<arrUrl.length; i++){
			        var x= arrUrl[i].split("=");
			        urlObj[x[0]]=x[1]
			    }
			    return urlObj;
			}
			
			

            function recognizeSpeech() {
                var maxMatches = 3;
                var promptString = "Hable ahora"; // optional
                var language = "es-UY";                     // optional
                window.plugins.speechrecognizer.startRecognize(function(result){
                	document.formulario.nombre.value = result[0];
                	document.formulario.nombre2.value = result[1];
                	alert(result[0]);
                	
                }, function(errorMessage){
                    /*console.log("Error message: " + errorMessage);
                    alert("Error message: " + errorMessage);*/
                	$('<div>').simpledialog2({
					    mode: 'button',
					    headerText: 'Cerrar',
					    headerClose: false,
					    buttonPrompt: 'El dispositivo no se encuentra conectado',
					    buttons : {
							
							'Aceptar': {
								click: function () { 
								  navigator.app.exitApp();
								},
								icon: 'delete',
								theme: 'c'
							  }
					    }
					});
                }, maxMatches, promptString, language);
            }
			
            // Show the list of the supported languages
            function getSupportedLanguages() {
                window.plugins.speechrecognizer.getSupportedLanguages(function(languages){
                    // display the json array
                    
                    alert(languages);
                }, function(error){
                    alert("Could not retrieve the supported languages : " + error);
                });
            }

            document.addEventListener("deviceready", onDeviceReady, true);
        </script>
		<div data-role=page id=home>
			<div data-role=header>
				<h1>Gu&iacute;a M&oacute;vil ANTEL</h1>
			</div>
		<div data-role=content class="scrollable">

		    <!--input type="button" data-icon="info" data-iconpos="left" onclick="recognizeSpeech();" value="Hable"/>
		    <input type="button" data-icon="grid" data-iconpos="left" onclick="javascript:send();" value="Asistencia"/-->
		    <!--button onclick="getSupportedLanguages();">Get Supported Languages</button-->
		    	<!--<div class=ui-grid-a>
					<div class=ui-block-a> <label for=nom>Nombre</label> <input name="tipo" type=radio value="Nombre" id="nom" checked/> </div>
					<div class=ui-block-b> <label for=dir>Direcci&oacute;n</label><input name="tipo" type=radio value="Direccion" id="dir"/> </div>
				</div> -->
			<table width="100%">
				<tr>
					<td align="left">
						<input type="image" data-role="button" src="img/micro.jpg" width="85" height="85" onclick="recognizeSpeech();" value="Hable"/>
					</td>
					<td align="right">
						<input type="image" data-role="button" src="img/fono.jpg" width="85" height="85"  value="Asistencia"/>
					</td>
				</tr>
				<tr>
					<td colspan="2" width="100%">
			<form name="formulario" id="formulario">
						<select name="tipo" id="tipo" data-native-menu=false>
							<option value="Nombre">Nombre</option>
							<option value="Direccion">Direcci&oacute;n</option>
						</select>					
					</td>
				</tr>
			</table>		    	
		    	<input type="hidden" name="nombre" />
		    	<input type="hidden" name="nombre2" />
		    </form>
		    <div id="escribir"></div>
		</div>
		</div>
		<div class="ui-loader-background"> </div>
		 <script type="text/javascript" >

            function send(){
            	function sucessCallback() {}
                function errorCallback() {}
                instantcaller.call("122",sucessCallback,errorCallback); 
            }
 
        </script>
    </body>
</html>